<template>
  <page-header-wrapper :title="false">
    <a-card :style="{ marginBottom: '10px' }">
      <template slot="title"><a-icon type="share-alt" /> 上班时间</template>
      <a-table :columns="columns1" :data-source="datas1" :pagination="false" :scroll="{ x: 3520 }" class="z-table-style">
        <template slot="attendance_punch_card" slot-scope="text">
          <div v-if="text==='正常'">{{ text }}</div>
          <div v-else :style="{ color: 'red' }">{{ text }}</div>
        </template>
      </a-table>
    </a-card>
    <a-card :style="{ marginBottom: '10px' }">
      <template slot="title"><a-icon type="share-alt" /> 工作完成情况</template>
      <a-table :columns="columns2" :data-source="datas2" :pagination="false" :scroll="{ x: 3520 }" class="z-table-style">
        <template slot="is_complete" slot-scope="text">
          <div v-if="text==='完成'">{{ text }}</div>
          <div v-else :style="{ color: 'red' }">{{ text }}</div>
        </template>
      </a-table>
    </a-card>
    <a-card>
      <template slot="title"><a-icon type="share-alt" /> 我的请假情况</template>
      <a-table :columns="columns" :data-source="datas">
        <template slot="prove_file" slot-scope="text">
          <a-button type="primary" size="small" ghost v-if="text!=''">查看</a-button>
        </template>
      </a-table>
      <div :style="{ color: 'red', textAlign: 'center' }"><a-icon type="smile" :style="{ fontSize: '20px' }"/> 以上考勤如有疑问，请联系小组长</div>
    </a-card>
  </page-header-wrapper>
</template>

<script>
  export default {
    name: 'Attendance',
    data () {
      return {
      }
    }
  }
</script>

<style scoped>

</style>
